<template>
  <el-table
    :data="tableData.filter(data => !search || data.name.toLowerCase().includes(search.toLowerCase()))"
    style="width: 95%">
    <el-table-column
      label="景点"
      prop="name"
      width="200">
    </el-table-column>
    <el-table-column
      label="介绍"
      prop="js">
    </el-table-column>
    <el-table-column
      label="景点照片"
      prop="pic"><img style="width:80px" src="../../../assets/img/backgound.jpg" alt="">
    </el-table-column>
    <el-table-column
        label="操作"
        width="100">
        <el-button  type="text" >查看</el-button>
        <el-button type="text" style="color:red">删除</el-button>
    </el-table-column>
  </el-table>
</template>

<script>
  export default {
    data() {
      return {
        tableData: [{
          name: '万山之宗',
          pic:'',
          js:'这是一片山'
        }],
      }
    },
    methods: {
      handleEdit(index, row) {
        console.log(index, row);
      },
      handleDelete(index, row) {
        console.log(index, row);
      }
    },
  }
</script>